<template>
  <div class="dig">
    <div class="abs-l">
      <div class="headArea">
        <el-date-picker type="daterange" v-model="datepicker" size="mini"
          start-placeholder="开始日期" range-separator="至" end-placeholder="结束日期"
          format="yyyy-MM-dd HH:mm:ss"
          unlink-panels :picker-options="pickerOptions">
        </el-date-picker>
        <el-button type="" size="mini" @click="thisGetHistory">加载</el-button>
      </div>
      <div class="bodyArea">
        <div class="loadingPlacehold" v-loading="L_loading" v-if="L_loading"></div>
        <WxMsg :msgList="Lo_MsgList" @scroll="scroll" v-if="!L_loading">
          <template slot="emptyImg">
            <el-empty :image="noData.src" :image-size="280"><div slot="description"><b class="">暂无记录</b></div></el-empty>
          </template>
          <div slot="suffix" slot-scope="scope">
            <span class="text-blue">来自：{{ scope.data.appName }}</span>
            <el-button type="warning" size="mini"
              @click="realTimeUpdata($event,'add',scope.data)"
              :loading="scope.data.isLoading"
              :disabled="scope.data.isInRight">
              向右添加
              <i class="fa fa-fw fa-long-arrow-right"></i>
            </el-button>
          </div>
        </WxMsg>
      </div>
      <div class="footArea"></div>
    </div>
    <div class="abs-r">
      <!-- <Draft ref="draft" :esId="eSCompanyId" :cusId="qYWXUsersId"/> -->
      <div class="headArea">
        <!-- <i class="fa fa-fw fa-cloud"></i>同步修改，无需提交 -->
        <el-input v-model="rfTitle" placeholder="请输入标题" size="mini">
          <template slot="prepend">
            <span class="text-red">*</span>标题
          </template>
          <el-button slot="append" @click="realTimeUpdataRfTitle">修改</el-button>
        </el-input>
      </div>
      <div class="bodyArea">
        <div class="loadingPlacehold" v-loading="R_loading" v-if="R_loading"></div>
        <WxMsg :msgList="R_MsgList" @scroll="scroll" v-if="!R_loading">
          <template slot="emptyImg">
            <el-empty :image="noData.src" :image-size="280"><div slot="description"><b class="">暂无记录</b></div></el-empty>
          </template>
          <div slot="suffix" slot-scope="scope">
            <el-button type="warning" size="mini"
              @click="realTimeUpdata($event,'remove',scope.data)"
              :loading="scope.data.isLoading">
              审核<i class="fa fa-fw fa-long-arrow-left"></i>
            </el-button>
            <span class="text-blue">来自：{{ scope.data.appName }}</span>
          </div>
        </WxMsg>
      </div>
      <div class="footArea"></div>
    </div>
  </div>
</template>

<script src="./edit.js"></script>

<style lang="less" scoped>
.loadingPlacehold{
  height:360px;
}
.dig{
  height:60vh;
}
@w1:51%;@w2:51%;
.abs-l{
  position: absolute;
  top:0;bottom:0;left:0;right:@w2;
  border:1px solid #ddd;
  border-radius: 16px;
}
.abs-r{
  position: absolute;
  top:0;bottom:0;left:@w1;right:0;
  border:1px solid #ddd;
  border-radius: 16px;
}

.h100{
  height:100%;
}

@hh:36px;@fh:36px;
.headArea{
  position: absolute;
  left:0;right:0;
  top:0;
  height:@hh;
  line-height:@hh;
  padding:2px 10px;
}
.bodyArea{
  position: absolute;
  top:@hh+10px;bottom:@fh+10px;
  left:10px;right:10px;
}
.footArea{
  position: absolute;
  left:0;right:0;
  bottom:0;
  height:@fh;
}
.text-blue{
  color:#409eff;
}
</style>